<style>
	.layui-badge-rim + .layui-badge-rim {
		margin-left: 5px;
	}
	.layui-table-cell {
		height: 45px;
		line-height: 45px;
	}
</style>
<div class="layui-fluid">
	<div class="layui-card">
		<div class="layui-card-body">
			<div class="layui-form toolbar layui-form-pane">
				<div class="layui-form-item">
					<div class="layui-inline">
						<label class="layui-form-label">关键字</label>
						<div class="layui-input-inline">
							<input id="keyWords" class="layui-input" type="text" placeholder="请输入" autocomplete="off"/>
						</div>
					</div>
					<div class="layui-inline">
						<label class="layui-form-label">状态</label>
						<div class="layui-input-inline">
							<select id="state">
							</select>
						</div>
					</div>
					<div class="layui-inline">
						<label class="layui-form-label">类型</label>
						<div class="layui-input-inline">
							<select id="type">
							</select>
						</div>
					</div>
					<div class="layui-inline">
						<label class="layui-form-label">所有权</label>
						<div class="layui-input-inline">
							<select id="ownership">
							</select>
						</div>
					</div>
					<div class="layui-inline">
						<label class="layui-form-label">有效时间</label>
						<div class="layui-input-inline" style="width: 100px;">
							<input type="text" placeholder="开始时间" class="layui-input" id='starDate' autocomplete="off">
						</div>
						<div class="layui-form-mid">-</div>
						<div class="layui-input-inline" style="width: 100px;">
							<input type="text" placeholder="结束时间" class="layui-input" id='endDate' autocomplete="off">
						</div>
					</div>
					<div class="layui-inline">
						<button id="btnSearch" class="layui-btn"><i class="layui-icon">&#xe615;</i>搜索
						</button>
						<button id="btnReset" class="layui-btn layui-btn-warm"><i class="layui-icon">&#xe669;</i>重置
						</button>
						<button type="button" id="export" class="layui-btn layui-btn-normal" style="background-color: #b79390"><i class="layui-icon">&#xe67d;</i>导出</button>
					</div>
				</div>
			</div>
			<table class="layui-table" id="infoTable" lay-filter="infoTable"></table>
		</div>
	</div>

</div>

<!-- 表格操作列 -->
<script type="text/html" id="infoTableBar">
	{{# if(d.state == 1){ }}
	<a class="layui-btn layui-btn-danger  layui-btn-xs" lay-event="edit">修改</a>
	{{# } }}
</script>
<script>
	layui.use(['layer', 'form', 'table', 'admin', 'config','laydate'], function () {
		var $ = layui.jquery;
		var layer = layui.layer;
		var form = layui.form;
		var table = layui.table;
		var laydate = layui.laydate;
		var admin = layui.admin;
		var config = layui.config;
		var userInfo = config.getUser();
		var page = 1;

		form.render('select');
		var startDate = laydate.render({
			elem: '#starDate', //指定元素
			format: 'yyyy-MM-dd', //可任意组合
			done: function(value, date){
				endDate.config.min ={
					year:date.year,
					month:date.month-1, //关键
					date: date.date,
				};
			}
		});
		var endDate =laydate.render({
			elem: '#endDate', //指定元素
			format: 'yyyy-MM-dd', //可任意组合
			done: function(value,date) {
				startDate.config.max = {
					year: date.year,
					month: date.month - 1,//关键
					date: date.date,
				}
			}

		});
		// 渲染表格
		table.render({
			elem: '#infoTable',
			url: serverUrlAdmin+'knowledge/getList.html',
			method:'POST',
			where: {
			},
			page: true,
			cellMinWidth: 80,
			cols: [[
				{align: 'center',field: 'name',title: '专利名称',
					templet:function (d){
						return "<a lay-event='show_detail' style='border-bottom: 1px solid blue;color: blue;'>"+d.name+"</a>";
					}
				},
				{align: 'center',field: 'knowledge_num',title: '知识产权号'},
				{align: 'center',field: 'ownership',title: '所有权人'},
				{align: 'center',field: 'knowledge_type',title: '类型',
					templet:function (d){
						if(d.knowledge_type_detail){
							return d.knowledge_type_detail
						}else{
							return d.knowledge_type
						}
					}
				},
				{align: 'center',field: 'phone_no',title: '知识产权有效日期',
					templet:function (d) {
						return d.knowledge_start_time + ' - '+d.knowledge_end_time;
					}
				},
				{align: 'center',field: 'conversion_type', title: '转化方式'},
				{align: 'center',field: 'conversion_get_money', title: '转化预收益'},
				{align: 'center',field: 'state_name', title: '状态',
					templet:function (d) {
						if(d.state == 1 || d.state == 4){
							return "<span style='color: rgba(236, 114, 13, 0.801)'>"+d.state_name+"</span>"
						}else if(d.state == 8){
							return "<span style='color: #26B2AE'>"+d.state_name+"</span>"
						}else{
							return "<span style='color: #FFB341'>"+d.state_name+"</span>"
						}
					}
				},
				{align: 'center',field: 'to_company_name', title: '受让方（甲方）'},
				{align: 'center',field: 'main_finished_person_name', title: '主要完成人',
					templet:function (d) {
						return d.main_finished_person_name + '('+d.main_finished_person_phone+')';
					}
				},
				{align: 'center',field: 'second_company', title: '所在二级单位'},
				{align: 'center',field: 'add_datetime', title: '申请时间'},
				// {align: 'left',toolbar: '#infoTableBar',title: '操作',width: 60,unresize: false}
			]],
			done: function (res, curr, count) {
				page = res.page;
			}

		});
		// 搜索按钮点击事件
		$('#btnSearch').click(function () {
			var where = getWhere();
			table.reload('infoTable', {where: where});
		});

		$('#btnReset').click(function () {
			$('#starDate').val('');
			$('#endDate').val('');
			$('#keyWords').val('');
			$('#state').val('');
			$('#type').val('');
			$('#ownership').val('');
			form.render();
			var where = getWhere();
			table.reload('infoTable', {where: where});
		});
		// 添加按钮点击事件
		$('#btnAdd').click(function () {
			// showEditModel();
			location.href='#/knowledge/edit';
		});
		// 工具条点击事件
		table.on('tool(infoTable)', function (obj) {
			var data = obj.data;
			var layEvent = obj.event;

			if (layEvent === 'edit') { // 删除
				location.href='#/knowledge/edit/id='+data.id;
				// showEditModel(data);
			}
		});
		form.on('submit(checkFormSubmit)', function (d) {
			var DISABLED = 'layui-btn-disabled';
			// 增加样式
			$('.site-demo-active').addClass(DISABLED);
			// 增加属性
			$('.site-demo-active').attr('disabled', 'disabled');

			d.field.opt_user_id = userInfo.user_id;
			d.field.opt_user_name = userInfo.real_name;
			$.post(serverUrlAdmin + 'Appuser/checkUserState', d.field, function (res) {
				layer.closeAll('loading');
				console.log(res)
				if (res.success === true) {
					layer.msg(res.obj, {icon: 1});
					layer.closeAll('page');
					var where = getWhere();
					table.reload('infoTable', {where: where});
				} else {
					layer.msg(res.msg, {icon: 2});
					$('.site-demo-active').removeClass(DISABLED);
					$('.site-demo-active').removeAttr('disabled');
				}
			},'json');
			return false;
		});

		form.on('submit(rechargeFormSubmit)', function (d) {
			var DISABLED = 'layui-btn-disabled';
			// 增加样式
			$('.site-demo-active').addClass(DISABLED);
			// 增加属性
			$('.site-demo-active').attr('disabled', 'disabled');

			d.field.opt_user_id = userInfo.user_id;
			d.field.opt_user_name = userInfo.real_name;
			$.post(serverUrlAdmin + 'Appuser/recharge', d.field, function (res) {
				layer.closeAll('loading');
				console.log(res)
				if (res.success === true) {
					layer.msg(res.obj, {icon: 1});
					layer.closeAll('page');
					var where = getWhere();
					table.reload('infoTable', {where: where});
				} else {
					layer.msg(res.msg, {icon: 2});
					$('.site-demo-active').removeClass(DISABLED);
					$('.site-demo-active').removeAttr('disabled');
				}
			},'json');
			return false;
		});


		function getWhere() {
			var time_start = $('#starDate').val();
			var time_end = $('#endDate').val();
			var keyWords = $('#keyWords').val();
			var state = $('#state').val();
			var type = $('#type').val();
			var ownership = $('#ownership').val();
			var where = {
				startTime: time_start,
				endTime: time_end,
				knowledgeType: type,
				ownershipVal: ownership,
				searchName: keyWords,
				statusVal:state
			};
			return where;
		}
		// 导出
		$('#export').click(function () {
			var where = getWhere();
			table.reload('infoTable', {where: where});
			location.href = serverUrlAdmin + 'Knowledge/exportList.html?startTime='+where.startTime+'&endTime='+where.endTime+'&knowledgeType='+where.knowledgeType+'&ownershipVal='+where.ownershipVal+'&searchName='+where.searchName+'&statusVal='+where.statusVal;
		});
		//缓存当前操作的是哪个表格的哪个tr的哪个td
		$(document).off('mousedown','.layui-table-grid-down').on('mousedown','.layui-table-grid-down',function (event) {
			//直接记录td的jquery对象
			table._tableTrCurrr = $(this).closest('td');
		});

		//给弹出的详情里面的按钮添加监听级联的触发原始table的按钮的点击事件
		$(document).off('click','.layui-table-tips-main [lay-event]').on('click','.layui-table-tips-main [lay-event]',function (event) {
			var elem = $(this);
			var tableTrCurrr =  table._tableTrCurrr;
			if(!tableTrCurrr){
				return;
			}
			var layerIndex = elem.closest('.layui-table-tips').attr('times');
			layer.close(layerIndex);
			table._tableTrCurrr.find('[lay-event="' + elem.attr('lay-event') + '"]').first().click();
		});
	});
</script>